/*.layui-nav-item a {*/
/*    max-width: 120px;*/
/*    text-overflow: ellipsis;*/
/*    overflow: hidden;*/
/*}*/

/* 顶部导航栏固定 */
.top-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px; /* 固定高度更可靠 */
    background: #333;
    padding: 0 15px; /* 上下padding改为0，避免影响垂直居中 */
    z-index: 1000;
    display: flex;
    align-items: center; /* 垂直居中内部内容 */
    box-sizing: border-box; /* 包含padding */
}

.top-nav ul {
    display: flex;
    /*gap: 20px;*/
    list-style: none;
    margin: 0;
    padding: 0;
    height: 100%; /* 继承父容器高度 */
}
/* 顶部导航栏按钮样式 */
.top-nav button.nav-btn {
    /* 基础样式 */
    background: #333;; /* 按钮背景色 */
    border: none;
    border-radius: 4px;
    color: white;
    padding: 8px 20px;
    cursor: pointer;
    transition: all 0.3s;

    /* 布局适配 */
    height: 80%; /* 避免撑满父容器 */
    min-width: 90px; /* 防止文字挤压 */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 左侧导航栏初始隐藏 */
.left-nav {
    position: fixed;
    left: -180px; /* 完全隐藏 */
    top: 50px;
    width: 180px;
    height: calc(100% - 50px);
    background: #f5f5f5;
    transition: left 0.3s;
}

.left-nav.active {
    left: 0; /* 显示 */
}

.left-nav ul {
    padding: 0; /* 紧凑内边距 */
    list-style: none;
    /* 新增三条关键属性 */
    margin: 0 !important;  /* 强制清除浏览器默认上边距[6,8](@ref) */
    line-height: 1;        /* 消除行高产生的间隙[3](@ref) */
    /*display: flex;         */
    /* 启用弹性布局控制子元素排列[4,6](@ref) */
    flex-direction: column;/* 纵向排列子项 */
}
.left-nav li {
    margin:  0; /* 增大行间距 */
    padding-left: 15px !important;  /* 统一左侧间距 */
}

/* 功能块父级按钮样式 */
.parent-btn {
    background: #2c3e50; /* 深蓝底色 */
    color: black !important;
    font-weight: 600;
    position: relative; /* 为箭头图标定位准备 */
    width: 100%;
    padding: 12px 0px;
    border-radius: 2px;/*移除圆角*/
    background: rgba(255,255,255,0.2);  /* 提升背景透明度增强对比度[6,7](@ref) */
    color: rgba(0,0,0,0.9);            /* 主文字颜色改为90%不透明黑色 */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* 贝塞尔曲线动画[4](@ref) */
    font-size: 15px;
    text-align: left;
    border: none;
}
/* 父级按钮激活状态 */
.left-nav-btn.parent-btn.active-parent {
    /*background: #3498db;*/
    border-left: 4px solid #ecf0f1;
    padding-right: 30px; /* 给箭头留空间 */

}
/* 子功能按钮容器 */
.sub-buttons {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 激活时展开子按钮 */
li.active-li .sub-buttons {
    max-height: 500px; /* 超过实际高度即可 */
}

/* 功能块箭头指示器 */
.parent-btn::after {
    content: '▶';
    position: absolute;
    right: 12px;
    transition: transform 0.3s;
}
.parent-btn.active-parent::after {
    transform: rotate(90deg);
}

/* 导航按钮样式 */
.left-nav .left-nav-btn {
    width: 100%;
    padding: 12px 0px;
    border-radius: 2px;/*移除圆角*/
    background: rgba(255,255,255,0.2);  /* 提升背景透明度增强对比度[6,7](@ref) */
    color: rgba(0,0,0,0.9);            /* 主文字颜色改为90%不透明黑色 */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); /* 贝塞尔曲线动画[4](@ref) */
    font-size: 15px;
    text-align: left;
    border: none;
}

/* 悬停效果 */
.left-nav .left-nav-btn:hover {
    background: rgba(255,255,255,0.15);
    /*transform: translateX(8px); !* 右侧偏移效果[5](@ref) *!*/
    box-shadow: 2px 2px 8px rgba(0,0,0,0.1);
}

/* 激活状态 */
.left-nav .left-nav-btn.active {
    background: #2980b9;
    border-left: 4px solid #ecf0f1; /* 左侧高亮指示条[6](@ref) */
    box-shadow: inset 3px 0 5px rgba(0,0,0,0.1);
}

/* 子菜单组默认隐藏 */
.submenu-group {
    display: none;
}
/* 激活状态的菜单组 */
.submenu-group.active-group {
    display: block !important;
    margin: 0;  /* 消除默认外边距 */
    padding: 0; /* 消除默认内边距 */
}
/* 确保隐藏元素不占位 */
.left-nav ul:not(.active-group) {
    height: 0;
    overflow: hidden;
}

/* 内容区域动态调整 */
.content {
    margin-top: 60px;
    padding: 10px;
    transition: margin-left 0.3s;
}

.content.with-sidebar {
    margin-left: 180px; /* 左侧导航显示时的偏移 */
}


/*顶部导航栏最右端相关样式*/
/* 新增下拉菜单样式 */
.dropdown-content {
    display: none;
    position: absolute;
    right: 0;
    background: #fff;
    min-width: 120px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    z-index: 1000;
    border-radius: 4px;
}

.dropdown-item {
    width: 100%;
    padding: 10px;
    border: none;
    background: none;
    text-align: left;
    cursor: pointer;
}

.dropdown-item:hover {
    background-color: #f5f5f5;
}

/* 显示下拉菜单 */
.show-dropdown {
    display: block !important;
}

.user-menu {
    margin-left: auto !important; /* 关键属性：强制右对齐 */
    position: relative;
}

/* 首页表格样式如下 */
/* 网格布局 */
.dashboard {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 30px;
    /*padding: 100px;*/
    padding: 20px 100px 30px; /* 修改后：上 20px 左右 100px 下 30px */
    height: calc(100vh - 130px);
}

/* 图表容器 */
.chart-panel {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
    padding: 15px;
}

/* 图表标题 */
.chart-title {
    font-size: 16px;
    color: #333;
    margin-bottom: 15px;
    padding-left: 10px;
    border-left: 4px solid #1890ff;
}

/* 图表容器 */
.chart-container {
    width: 100%;
    height: 400px;
}

/*统计部分查询框和按钮*/
.chart-query-container {
    margin-bottom: 15px;
    display: flex;
    gap: 10px;
    align-items: center;
}

.chart-container {
    overflow: auto;
}
.chart-container::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.chart-container::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

.chart-query-btn {
    padding: 6px 15px;
    background-color: #1890ff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.chart-query-btn:hover {
    background-color: #40a9ff;
}